import React,{Component} from "react"

import {
    View,
    Text,
    StyleSheet,
}from 'react-native'


import DatePicker from 'react-native-datepicker'

const styles=StyleSheet.create({
    topwarp:{
       width:'100%',
       borderBottomWidth:1,
       borderColor:'#ddd',
       height:50,
       flexDirection:'row',
       justifyContent:'space-around',
       alignItems:'center',
       backgroundColor:'white',
       shadowColor:"black",
       shadowOpacity:0.5,
       shadowRadius:2,
       shadowOffset:{h:10,w:10}
     },
     content:{
         height:'100%',
         backgroundColor:'white',
         justifyContent:'center',
         flexDirection:"row",
     },
     contentin:{
         marginTop:40,
         width:'80%',
         height:50
     },
     item:{
         width:'100%',
         borderWidth:1,
         borderColor:'#ddd',
         height:'100%',
         padding:20,
         justifyContent:'space-between',
         alignItems:'center',
         flexDirection:'row'
     },
     lefttext:{
         color:'black'
     }
})


export default class RenGong extends Component{
        static navigationOptions={
        title:'增销售',
        headerTitleStyle: {
        alignSelf:'center'
      },
        headerRight: (
        <Text></Text>
        ),
    };

    state={
        datebegin:'2017-05-15'
    }

    freshData=function(){

    }

    render(){
        return(
            <View style={{flex:1}}>
                <View style={styles.topwarp}>
      <DatePicker
        style={{width: 130}}
        date={this.state.datebegin}
        mode="date"
        placeholder="select date"
        format="YYYY-MM-DD"
        minDate="2016-05-01"
        confirmBtnText="Confirm"
        cancelBtnText="Cancel"
        customStyles={{
          dateIcon: {
            position: 'absolute',
            left: 0,
            top: 4,
            marginLeft: 0
          },
          dateInput: {
            marginLeft: 36,
            borderRadius:8
          }
        }}
        onDateChange={(date) => {this.setState({datebegin: date});this.freshData()}}
      />
      </View>

      <View style={styles.content}>
         <View style={styles.contentin}>
            <View style={styles.item}>
                <Text style={styles.lefttext}>时间：</Text>
                <Text>2018-01-25</Text>
            </View>
            <View style={styles.item}>
                <Text style={styles.lefttext}>新顾客:</Text>
                <Text>2018-01-25</Text>
            </View>
            <View style={styles.item}>
                <Text style={styles.lefttext}>老顾客：</Text>
                <Text>2018-01-25</Text>
            </View>
            <View style={styles.item}>
                <Text style={styles.lefttext}>餐厅名称：</Text>
                <Text>2018-01-25</Text>
            </View>
            
         </View>
      </View>


            </View>
        )
    }
}


